<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
    <meta name="referrer" content="never">
    <title>温习</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        ul {
            list-style: none;
        }
    </style>
</head>
<body>
    offset
        Width/Height：元素占据页面的尺寸 -》 元素自身的宽高 + padding + border
        Parent：返回距离元素最近的带有定位的父节点。找不到返回body。fixed定位的元素该属性返回 null
        Top/Left：返回元素距离它的offsetParent的内容区的上左边距
    scroll
        Width/Height：返回元素内容的宽高 -> 元素自身宽高 + padding，不加border。如果内容溢出，溢出内容的宽高 + 上左padding；如果元素加上overflow，padding（上左下）
        Top/Left：返回元素被卷入的上左边距，可读写的非整数
        页面卷入上左边距：window.pageX/YOffset  兼容写法：html.scrollTop/Left || window... || body....
        页面滚动：window.scroll(x,y) 滚动到具体位置  window.scrollBy(x,y) 相对唯一
        页面顺滑滚动：
            1. html { scroll-behavior: smooth }
            2. window.scroll({ top: xx, left: xx, behavior: "smooth" })
    <script type="text/javascript">
        
    </script>
</body>
</html>